<back-to-top class="back_top" title="返回顶部"></back-to-top>
  <!-- Page Content -->
<div class="container">

    <div class="row">
        <div class="col-md-6">
           <h3>{{detail.name}}</h3>
           <p> {{detail.codes}}-{{detail.title}}</p>
        </div>
         <div class="col-md-6 detail-title-2">
            <h4>代购价&nbsp;&nbsp;
              <span style="text-decoration:line-through;font-size: 20px;">￥{{detail.oldprice}}</span>
              <span>￥{{detail.price}}</span>
            </h4>
           <p><button ng-click="buy()" type="button" class="btn btn-10 btn-warning">购买</button></p>
        </div>
    </div>

    <div class="row">
      <div id="myCarousel" class="carousel slide pad_010 b_k" data-ride="carousel">
        <!-- 轮播（Carousel）指标 -->
        <ol class="carousel-indicators">
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
            <li data-target="#myCarousel" data-slide-to="1"></li>
        </ol>   
        <!-- 轮播（Carousel）项目 -->
        <div class="carousel-inner bor_btm">
            <div class="carousel-inner bor_btm">
                <div ng-repeat="(i,imgs) in detail.imgs" class="item {{i==0?'active':''}}" >
                    <div class="detail-pic">
                        <img  ng-repeat="imgUrl in imgs" ng-src="{{imgUrl}}" >
                    </div>
                </div>
            </div>
         </div>
         <!-- 轮播（Carousel）导航 -->
         <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
         <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>      
      </div>
    </div>

    <div class="row">
        <div class="col-md-8">
          <ul id="myTab" class="nav nav-tabs">
              <li class="active">
                  <a href="#t1" data-toggle="tab">
                      详情描述
                  </a>
              </li>
              <li>
                <a  href="#t2" data-toggle="tab">评论 <span class="badge">{{comment.num}}</span></a>
              </li>
          </ul>
          <div id="myTabContent" class="tab-content">
              <div class="tab-pane fade in active" id="t1">
                  <div ng-bind-html="detail.desc | trustHtml"></div>
              </div>
              <div class="tab-pane fade" id="t2">
                  
                  <div class="input-group">
                    <span class="input-group-addon">@</span>
                    <input type="text" maxlength="100" class="form-control" 
                    ng-model="comment.content"
                    placeholder="请输入你要回复的内容">
                    <span class="input-group-addon" ng-click="reply()">进行回复</span>
                  </div>
                  <div class="alert alert-info" role="alert" ng-show="!showMe">请先
                      <a href="#/login">登录</a>或<a href="#/register">注册</a>后进行评论
                  </div>

                  <div class="media" ng-repeat="(key, comment) in commentList">
                    <div class="media-left">
                      <a href="#">
                        <img class="media-object" ng-src="{{comment.header}}">
                      </a>
                    </div>
                    <div class="media-body">
                      <h4 class="media-heading">{{comment.nick}}</h4>
                      {{comment.content}}
                      <p class="right">{{comment.created | date:"yyyy-MM-dd"}}</p>
                    </div>
                    <hr>
                  </div>
              </div>
          </div>
        </div>

      <div class="col-md-1"></div>
      
      <div class="col-md-3">
          <p>
            <button class="btn btn-primary btn-full" 
              ng-click="demo(detail.demo)">Demo</button>
          </p>
          <p>
            <button ng-click="buy()" class="btn btn-success btn-full">现在购买</button>
          </p>
          <div class="media">
            <div class="media-left">
              <a href="#">
                <img class="media-object" ng-src="{{detail.details.author2}}">
              </a>
            </div>
            <div class="media-body">
              <h4 class="media-heading">{{detail.details.author1}}</h4>
            </div>
          </div>
          <br>
          <ul class="list-group">
            <li class="list-group-item disabled row">
              <span class="col-md-12">详细信息</span>
            </li>
            <li class="list-group-item row" ng-repeat="obj in detail.details.details">
              <span class="col-md-4">{{obj.key}}</span>
              <span class="col-md-8">{{obj.val}}</span>
            </li>
          </ul>
      </div>
    </div>


    

</div>
<!-- /.container -->

<script>
  $(document).ready(function(){
    $('#myCarousel').carousel();
    }
  
</script>
<style type="text/css" media="screen">
  .media-heading {
    margin-top: 15px;
  }  
  .right{
    text-align: right;
  }
  #t1 > div > h6 > span{
    color: #fff;
  }
</style>>

<!-- 
<div class="item active" >
    <div class="detail-pic">
        <img src="http://goldapp.oss-cn-shanghai.aliyuncs.com/screenshot_1.png" >
        <img src="http://goldapp.oss-cn-shanghai.aliyuncs.com/screenshot_2.png" >
        <img src="http://goldapp.oss-cn-shanghai.aliyuncs.com/screenshot_3.png" >
        <img src="http://goldapp.oss-cn-shanghai.aliyuncs.com/screenshot_4.png" >
    </div>
</div>
<div class="item">
    <div class="detail-pic">
        <img src="http://goldapp.oss-cn-shanghai.aliyuncs.com/screenshot_1.png" >
        <img src="http://goldapp.oss-cn-shanghai.aliyuncs.com/screenshot_2.png" >
        <img src="http://goldapp.oss-cn-shanghai.aliyuncs.com/screenshot_3.png" >
        <img src="http://goldapp.oss-cn-shanghai.aliyuncs.com/screenshot_4.png" >
    </div>
</div> -->